<template>
  <by-background />

  <by-navigation-bar title="设置" />

  <view class="padding-20">
    <view class="padding-tb-10 padding-lr-20 bg-white page">
      <by-cell
        v-for="(item,index) in list"
        :key="index"
        :label="item.label"
        :model-value="item.value"
        :border="index < list.length - 1"
        :show-arrow="item.src !== 'service'"
        @click="handleClick(item)"
      >
        <switch v-if="item.src === 'service'" :checked="userStore.userData.isPersonalization" class="switch" color="#FFDA27" @change="handleChange"/>
      </by-cell>
    </view>

    <view class="padding-lr-10">
      <by-button height="78rpx" font-size="32rpx" bold text="退 出 登 录" @click="logout"/>
    </view>
  </view>

  <!-- #ifdef APP-PLUS -->
  <by-app-update v-model="showUpdateDialog" ref="updateDialog" show-tip @get-version="setListVersion"/>
  <!-- #endif -->

  <by-dialog v-model="showModal" title="是否确认注销用户？" content="用户注销后将清除所有用户信息，重新注册后方可再次登录" @confirm="handleAppleCancelAccount"/>
</template>

<script setup lang="ts">
import useUserStore from '@/store/user'
import { jump, toast } from '@/common/util'
import { appleCancelAccount } from '@/common/api'
/* #ifdef APP-PLUS*/
import { clearCache, getVersion } from '@/common/plus'
import { updatePersonalization } from '@/common/api'
/* #endif*/
import type { AnyObject } from '@/common/types'

const userStore = useUserStore()
const list = reactive([
  { label: '用户反馈', src: '/pages/suggest/index?type=0', value: '' },
  { label: '用户投诉', src: '/pages/suggest/index?type=4', value: '' },
  { label: '退款申请', src: '/pages/refund/index', value: '' },
  /* #ifdef APP-PLUS*/
  // { label: '个性化服务', src: 'service', value: '' },
  { label: '清理缓存', src: 'clearCache', value: '' },
  { label: '版本更新', src: 'update', value: '' },
  /* #endif*/
  { label: '注销账户', src: 'cancelAccount', value: '' }
])

const showModal = ref(false)
const updateDialog = ref()
function handleClick(item:AnyObject) {
  if (item.src === 'service') return
  /* #ifdef APP-PLUS*/
  if (item.src === 'clearCache') {
    clearCache()
    return
  }
  if (item.src === 'update') {
    console.log(updateDialog)
    updateDialog.value.handleNewGetVersion()
    return
  }
  /* #endif*/
  if (item.src === 'cancelAccount') {
    showModal.value = true
    return
  }
  jump(item.src)
}

function logout() {
  userStore.userData = {}
  jump('login', 'redirectTo')
}

/* #ifdef APP-PLUS*/
function setListVersion(e:string) {
  list.forEach((item, index) => {
    if (item.src === 'update') list[index].value = e
  })
}

async function handleChange(e:AnyObject) {
  const data = e.detail.value ? 1 : 0
  await updatePersonalization(data)
  userStore.userData.isPersonalization = data
}

/**
 * 返回监听 start
 * */
const showUpdateDialog = ref(false)
onBackPress(() => {
  if (showUpdateDialog.value) {
    showUpdateDialog.value = false
    return true
  }
})
/**
 * 返回监听 end
 * */
/* #endif*/

async function handleAppleCancelAccount() {
  await appleCancelAccount()
  logout()
  toast('已经提交注销申请')
}
</script>

<style scoped lang="scss">
.page{
  border-radius: 16rpx;
  margin-bottom: 80rpx;
}
.switch{
  width: 110rpx;
  height: 60rpx;
}
</style>
